<!--
 * @Author: 叫我龟先生 yyxxkahhh@163.com
 * @Date: 2022-09-19 20:53:02
 * @LastEditors: 叫我龟先生 yyxxkahhh@163.com
 * @LastEditTime: 2022-09-19 21:23:08
 * @FilePath: \vue-01\src\作业4.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div>
     <h4>选择你喜欢的专栏</h4>
        <!-- 复选框必须用数组 -->
        <span v-for="(item,index) in arr" :key="index">
        <input type="checkbox" :value="item" v-model="newArr">{{item}}
        </span>
        <ul v-for="(item,index) in newArr" :key="index">
            <li>{{item}}</li>
        </ul>
        
  </div>
</template>

<script>
export default {
data () {
    return {
        arr:["科幻", "喜剧", "动漫", "冒险", "科技", "军事", "娱乐", "奇闻"],
        newArr:[]
    }
}
}
</script>

<style>

</style>